<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">

		<title>TableList</title>

		<script src="./js/jquery-1.4.2.min.js" type="text/javascript">
</script>
		<script src="./js/jquery.easyui.min.js" type="text/javascript">
</script>

		<link rel="stylesheet" type="text/css"
			href="./styles/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="./styles/icon.css">



		<script>
$(function() {
	$('#test')
			.datagrid(
					{
						title : 'My Title',
						iconCls : 'icon-save',
						width : 740,
						height : 480,
						nowrap : false,
						striped : true,
						collapsible : true,
						url : 'http://localhost:8080/spring3upload_jquery/getip/getallip',
						sortName : 'id',
						sortOrder : 'asc',
						remoteSort : false,
						idField : 'id',
						frozenColumns : [ [ {
							field : 'ck',
							checkbox : true
						}

						] ],

						columns : [ [

								{
									field : 'id',
									title : 'ID',
									width : 30
								},
								{
									field : 'ipaddress',
									title : 'IP地址',
									width : 100
								},
								{
									field : 'realaddress',
									title : '地理位置',
									width : 320,
									align : 'left',
									editor : 'text'

								},
								{
									field : 'createtime',
									title : '创建时间',
									width : 120,
									align : 'left'
								},

								{
									field : 'opt',
									title : '操作',
									width : 100,
									align : 'center',
									formatter : function(value, row, index) {
										if (row.editing) {
											var s = '<a href="#" onclick="saverow(' + index + ')">Save</a> ';
											var c = '<a href="#" onclick="cancelrow(' + index + ')">Cancel</a>';
											return s + c;
										} else {
											var e = '<a href="#" onclick="editrow(' + index + ');return false">编辑</a> ';
											var d = '<a href="#" onclick="del(\'' + index + '\');return false">删除</a> ';
											return e + d;
										}
									}
								}

						] ],

						pagination : true,
						rownumbers : true,
						toolbar : [ {
							id : 'btnadd',
							text : 'Add',
							iconCls : 'icon-add',
							handler : function() {
								$('#btnsave').linkbutton('enable');
								alert('add')
							}
						}, {
							id : 'btncut',
							text : 'Cut',
							iconCls : 'icon-cut',
							handler : function() {
								$('#btnsave').linkbutton('enable');
								alert('cut')
							}
						}, '-', {
							id : 'btnsave',
							text : 'Save',
							disabled : true,
							iconCls : 'icon-save',
							handler : function() {
								$('#btnsave').linkbutton('disable');
								alert('save')
							}
						} ]

					});
	var p = $('#test').datagrid('getPager');
	if (p) {
		$(p).pagination( {
			onBeforeRefresh : function() {
				alert('before refresh');
			}
		});
	}

});

function del(index) { //删除操作  
	$.messager
			.confirm(
					'确认',
					'确认删除?',
					function(row) {
						if (row) {
							var selectedRow = $('#test')
									.datagrid('getSelected');
							var uid = selectedRow.id;
							$
									.ajax( {

										url : 'http://localhost:8080/spring3upload_jquery/getip/delid/' + uid,
										success : function() {
											alert('删除成功');
										}
									});
							$('#test').datagrid('deleteRow', index);
						}
					})
}

function updateActions() {
	var rowcount = $('#test').datagrid('getRows').length;
	for ( var i = 0; i < rowcount; i++) {
		$('#test').datagrid('updateRow', {
			index : i,
			row : {
				action : ''
			}
		});
	}
}

function editrow(index) {
	$('#test').datagrid('beginEdit', index);

}

function saverow(index) {

	$('#test').datagrid('endEdit', index);
}
function cancelrow(index) {
	$('#test').datagrid('cancelEdit', index);
}

function resize() {
	$('#test').datagrid('resize', {
		width : 700,
		height : 400
	});
}
function getSelected() {
	var selected = $('#test').datagrid('getSelected');
	if (selected) {
		alert(selected.code + ":" + selected.name + ":" + selected.addr + ":"
				+ selected.col4);
	}
}
function getSelections() {
	var ids = [];
	var rows = $('#test').datagrid('getSelections');
	for ( var i = 0; i < rows.length; i++) {
		ids.push(rows[i].code);
	}
	alert(ids.join(':'));
}
function clearSelections() {
	$('#test').datagrid('clearSelections');
}
function selectRow() {
	$('#test').datagrid('selectRow', 2);
}
function selectRecord() {
	$('#test').datagrid('selectRecord', '002');
}
function unselectRow() {
	$('#test').datagrid('unselectRow', 2);
}
function mergeCells() {
	$('#test').datagrid('mergeCells', {
		index : 2,
		field : 'addr',
		rowspan : 2,
		colspan : 2
	});
}
</script>
	</head>

	<body>
		<h1>
			DataGrid
		</h1>


		<table id="test"></table>

	</body>
</html>
